<template>
    <div class="collection">
       <div class="title clearfix">
           <ul>
               <li>订单信息</li>
               <li>价格</li>
           </ul>
       </div>
        <div class="content-list clearfix">
          <ul class="clearfix">
              <li>
                  <div class="user clearfix">
                      <img src="../../../assets/meirong1.jpg" alt="">
                      <div class="user-text">
                         <p>注射微整</p>
                         <p>北京微美医疗美容诊所</p>
                      </div>
                  </div>
              </li>
              <li>￥399<span>￥399</span></li>
          </ul>
            <ul class="clearfix">
                <li>
                    <div class="user clearfix">
                        <img src="../../../assets/meirong1.jpg" alt="">
                        <div class="user-text">
                            <p>注射微整</p>
                            <p>北京微美医疗美容诊所</p>
                        </div>
                    </div>
                </li>
                <li>￥399<span>￥399</span></li>
            </ul>
        </div>
    </div>
</template>

<script>
    export default {
        name: "Collection"
    }
</script>

<style scoped lang="less">
    @import "../../../style/style";
    .collection{
        border: solid 1px #e0e0e0;
        .title{
            background-color: #f5f5f5;
            ul{
                li{
                    float: left;
                    width: 50%;
                    text-align: center;
                    color: #666666;
                    font-size: 12px;
                    padding: 15px 0;
                }
            }
        }
        .content-list{
            padding: 17px;
             ul{
                 border: solid 1px #e0e0e0;
                 padding: 17px;
                 margin-bottom: 20px;
                 margin-top: 10px;
                 >:last-child{
                     text-align: center;
                     padding-left: 10px;
                     color: @theme-color-dark;
                     font-size: 20px;
                     padding-top: 23px;
                     span{
                         color: #999999;
                         font-size: 14px;
                         text-decoration:line-through;
                     }
                 }
                 li{
                     float: left;
                     width: 50%;
                     img{
                         width: 80px;
                         height: 80px;
                         float: left;
                     }
                     .user-text{
                         margin-left: 20px;
                         float: left;
                         >:first-child{
                             color: #333333;
                             font-size: 14px;
                             padding-top: 20px;
                             padding-bottom: 5px;
                         }
                         p{
                             color: #999999;
                         }
                     }
               }
           }
        }
    }
</style>